import { Component, Output, Input, EventEmitter, ViewChild, ViewContainerRef } from '@angular/core';
declare var $: any;


/**
 * Modal main component
 *
 * Author: Sorin Spiru
 * Date: 13.01.2018
 */
@Component({
    selector: 'app-modal',
    templateUrl: './modal.component.html',
    styleUrls: ['./modal.component.scss']
})
export class ModalComponent {
    @Input() showCloseButton: boolean = true;
    @Input() showTopCloseButton: boolean = false;
    @Input() criteria: boolean = false;
    @Input() id = 'modal';
    @Input() size = 'modal-md';

    @Output() displayed: EventEmitter<void> = new EventEmitter<void>();
    @Output() hidden: EventEmitter<void> = new EventEmitter<void>();

    constructor() { }

    public show(): void {
        $('#' + this.id).modal('show');
        this.displayed.emit();

        $('#' + this.id).off('hidden.bs.modal').on('hidden.bs.modal', _ => {
            this.hidden.emit();
        });
    }

    public hide(): void {
        $('#' + this.id).modal('hide');
    }
}